<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div class="view">
    <form onsubmit="return false">
        <input type="text" name="username" v-model="username"> <br/>
        <input type="password" name="password" v-model="password"> <br/>
        <input type="tel" name="phone" v-model="phone"> <br/>
        <textarea v-model="text"></textarea>
        <button @click="submit()">提交</button>
    </form>
</div>
<script src="./js/vue.js"></script>
<script src="./axios.js"></script>
<script src="./js/jsencrypt.js"></script>
<script>
    Vue.createApp({
        data() {
            return {
                username: undefined,
                password: undefined,
                phone: undefined,
                text: "请仔细阅读用户协议"
            }
        },
        methods: {
            submit() {
                // 获取公钥
                axios.get("http://localhost:8080/getP").then(res => {
                    let resp = res.data
                    if (resp.code === 1) {
                        console.log(resp)
                        let publicKey = resp.data.public
                        let uuid = resp.data.uuid
                        // TODO 使用公钥加密登录
                        // let jsencrypt = new JSEncrypt()
                        // jsencrypt.setKey("publickey")
                        // let user = jsencrypt.encrypt(username) // false
                        axios.post(
                            'http://localhost:8080/login',
                            "username=" + this.username + "&password=" + this.password + "&uuid=" + uuid
                        ).then(res => {
                            if (res.data.code === 1) {
                                location.href = "index.html"
                            }
                        })

                    }
                })

            }
        }
    }).mount(".view")
</script>
</body>
</html>